// //编辑个人信息
import React, { Component } from 'react'
import {
    View,
    Text,
    Image,
    StyleSheet,
    TextInput,
    TouchableOpacity,
    ScrollView,
    Modal,
} from 'react-native';

import { expedit_Style as styles } from '../../../styles';
import Icon from 'react-native-vector-icons/Ionicons';
var Dimensions = require('Dimensions');
var width = Dimensions.get('window').width;
var height = Dimensions.get('window').height;


export default class One extends Component {

    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            isModal: false
        };
    }

    showModal() {
        this.setState({
            isModal: true
        })
    }

    onRequestClose() {
        this.setState({
            isModal: false
        });
    }

    render() {
        return (
            <View style={styles.container}>
                {/* 初始化Modal */}
                <Modal
                    animationType='slide'           // 从底部滑入
                    transparent={true}             // 不透明
                    visible={this.state.isModal}    // 根据isModal决定是否显示
                    onRequestClose={() => { this.onRequestClose() }}  // android必须实现

                >
                    <View style={{flex:1,backgroundColor:'rgba(0, 0, 0, 0.3)'}}>
                        <View style={[styles.modalViewStyle, { height: height * 0.3, width: width * 1 }]}>
                            {/* 关闭页面 */}
                            <TouchableOpacity
                                onPress={() => {
                                    {
                                        this.setState({
                                            isModal: false
                                        })
                                    }
                                }}
                            >
                                <Text>关闭页面</Text>
                            </TouchableOpacity>
                        </View></View>
                </Modal>

                {/* 返回按钮 */}
                <TouchableOpacity
                    onPress={() => {
                        {
                            this.props.navigator.pop()
                        }
                    }}
                >
                    <Text>返回</Text>
                </TouchableOpacity>

                {/* 模态跳转 */}
                <TouchableOpacity
                    onPress={() => this.showModal()}
                >
                    <Text>模态跳转</Text>
                </TouchableOpacity>
            </View>
        );
    }
}